<template>
  <a-modal v-model:visible="modalVisible" @ok="handleOk" @cancel="handleCancel">
    <template #title> 新增文件夹 </template>
    <div>
      <a-form ref="FormData" layout="vertical" :model="form" auto-label-width>
        <a-form-item label="父级文件夹:">
          <a-input v-model="form.parentName" disabled allow-clear />
        </a-form-item>
        <a-form-item field="storeName" label="名称" required>
          <a-space direction="vertical" fill>
            <a-popover v-if="initialize" position="right">
              <icon-exclamation-circle
                :style="{
                  position: 'relative',
                  marginLeft: '10px',
                  color: 'red'
                }"
                :size="16"
              />
              <template #content>
                <p>当文档没有根目录时，需手动创建！</p>
              </template>
            </a-popover>
            <a-input
              v-model="form.storeName"
              :disabled="initialize"
              allow-clear
            />
          </a-space>
        </a-form-item>
        <a-form-item field="status" label="数据状态:">
          <a-switch
            v-model="form.status"
            :checked-value="1"
            :unchecked-value="2"
          />
        </a-form-item>
      </a-form>
    </div>
  </a-modal>
</template>

<script lang="ts" setup>
import { reactive, computed, ref, watchEffect } from 'vue';
import { getFileDelong } from '@/apis/document/documentCenter/index';

const props = withDefaults(
  defineProps<{
    visible: boolean;
    data: any;
  }>(),
  {
    visible: false
  }
);
const userId = Number(localStorage.getItem('userId'));

const fieldNames = { value: 'id', label: 'storeName' };
const initialize = ref(false);
const emit = defineEmits(['update:visible', 'addDocumentEmit']);
const FormData = ref();
// 判断用户是否显示弹出框
const modalVisible = computed({
  get() {
    return props.visible;
  },
  set(visible: boolean) {
    emit('update:visible', visible);
  }
});

let form = reactive<any>({
  userId,
  storeName: '',
  parentName: '',
  parentId: null,
  clientId: undefined,
  status: 1,
  knowledgeState: 1
});

const rules = reactive({});

// 取消
const handleCancel = () => {
  modalVisible.value = false;
};

// 确定
const handleOk = async () => {
  FormData.value.validate((res: any) => {
    if (!res) {
      emit('addDocumentEmit', form);
      FormData.value.resetFields();
    }
  });
};

watchEffect(() => {
  if (modalVisible.value) {
    // console.log(1);
    Object.assign(form, props.data);
  }
});
</script>

<style scoped lang="less"></style>
